html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    padding-top: 8.125rem;
}

ul, p {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.clear {
    clear: both;
}

.cl:after {
    content: '';
    clear: both;
    display: table;
}

a {
    text-decoration: none !important;
}

h1 {
    font-size: 2.25rem;
}

h2 {
    font-size: 1.875rem;
}

h3 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.125rem;
}

h5 {
    font-size: 1rem;
}

h6 {
    font-size: 1rem;
}

@font-face {
    font-family: 'MONTSERRAT-BOLD';
    src: url("../fonts/MONTSERRAT-BOLD.OTF");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MONTSERRAT-LIGHT';
    src: url("../fonts/MONTSERRAT-LIGHT.OTF");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'D-DINCONDENSED-BOLD';
    src: url("../fonts/D-DINCONDENSED-BOLD.TTF");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MONTSERRAT-HAIRLINE';
    src: url("../fonts/MONTSERRAT-HAIRLINE.OTF");
    font-weight: normal;
    font-style: normal;
}

.dw {
    position: relative;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.absolute_img {
    position: relative;
    overflow: hidden;
}

    .absolute_img img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        max-width: 100%;
        max-height: 100%;
    }

/* 关于flex */
.flex {
    display: flex;
}

.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}

.flex-start-center {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.flex-start-end {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.flex-start-between {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.flex-center-start {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.flex-center-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-center-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.flex-center-around {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.flex-center-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex-end-start {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.flex-end-center {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.flex-end-end {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.flex-end-between {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.flex-stretch-start {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
}

.flex-stretch-center {
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.flex-stretch-end {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
}

.flex-stretch-between {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.flex-stretch-around {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
}

/* 浏览器滚动条隐藏 */
/* 谷歌与苹果自带浏览器 */
*::-webkit-scrollbar {
    display: none;
}

* {
    /* 火狐浏览器 */
    scrollbar-width: none;
    /* IE 与微软浏览器 */
    -ms-overflow-style: none;
}

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 8.125rem;
    z-index: 990;
    transition: all 0.5s ease-out;
    background: #fff;
}

    .header.active {
        height: 6.25rem;
        background: white;
        box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.1);
    }

        .header.active .dropdown-nav {
            top: 6.25rem;
        }

        .header.active .pc_nav > ul > li {
            line-height: 6.25rem;
        }

        .header.active .logo a img {
            height: 3.75rem;
        }

        .header.active .head_more {
            color: #333;
        }

    .header > .container {
        height: 100%;
    }

.logo {
    height: 100%;
    margin-right: auto;
}

    .logo a {
        height: 100%;
    }

        .logo a img {
            height: 5.625rem;
            transition: all .5s ease-out;
        }

.pc_nav {
    height: 100%;
}

    .pc_nav > ul {
        height: 100%;
    }

        .pc_nav > ul > li {
            height: 100%;
            line-height: 8.125rem;
            position: relative;
            transition: all .1s linear;
        }

            /* .pc_nav > ul > li::before {
  content: '';
  width: 100%;
  height: 0;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: 0;
	transition: all .5s ease;
	background: linear-gradient(180deg, #4B702F 0%, #8FD65A 100%);
} */

            .pc_nav > ul > li.active {
                height: 100%;
                background: linear-gradient(180deg, #4B702F 0%, #8FD65A 100%);
            }

                .pc_nav > ul > li.active::after {
                    content: '';
                    width: 0.75rem;
                    height: 0.75rem;
                    background: url(../img/home/small.png) center no-repeat;
                    background-size: 100% 100%;
                    position: absolute;
                    top: calc(100% - 1.5rem);
                    left: 50%;
                    transform: translateX(-50%);
                }

            .pc_nav > ul > li > a {
                color: #333;
                font-size: 1.25rem;
                padding: 0 2rem;
                white-space: nowrap;
                transition: all .5s ease;
            }

            .pc_nav > ul > li a:hover {
                color: #8FD65A;
            }

            .pc_nav > ul > li.active a {
                color: #fff;
                font-weight: bold;
            }

.app_nav {
    display: none;
}

.xs_bg {
    display: none;
    opacity: 0;
    pointer-events: none;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9;
    transition: all 0.3s ease;
}

    .xs_bg.active {
        opacity: 1;
        pointer-events: auto;
    }

.menu-link {
    cursor: pointer;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
    display: none;
}

    .menu-link span {
        width: 2.25rem;
        height: 1.875rem;
        display: inline-block;
        position: relative;
    }

        .menu-link span i {
            width: 100%;
            height: 3px;
            display: block;
            background: #fff;
            position: absolute;
            top: 50%;
            left: 0;
            transform: translateY(-50%);
            transition: all 0.3s ease-out;
        }

        .menu-link span::after {
            content: '';
            background: #fff;
            width: 100%;
            height: 3px;
            position: absolute;
            top: 0;
            left: 0;
            transition: all 0.3s ease-out;
            transform-origin: right top;
        }

        .menu-link span::before {
            content: '';
            background: #fff;
            width: 100%;
            height: 3px;
            position: absolute;
            bottom: 0;
            left: 0;
            transition: all 0.3s ease-out;
            transform-origin: right bottom;
        }

    .menu-link.active span:after {
        transform: rotate(-45deg);
    }

    .menu-link.active span:before {
        transform: rotate(45deg);
    }

    .menu-link.active span i {
        background: transparent;
    }

.dropdown-nav {
    position: absolute;
    top: 8.125rem;
    left: 0;
    width: 100%;
    pointer-events: none;
    opacity: 0;
    transition: all 0.3s ease;
}

    .dropdown-nav::after {
        content: '';
        width: 100%;
        height: 3.125rem;
        position: absolute;
        left: 0;
        bottom: 100%;
    }

    .dropdown-nav.active {
        pointer-events: auto;
        opacity: 1;
        transform: translateY(0);
    }

    .dropdown-nav .items {
        background: #fff;
        padding: 3.25rem;
        /* box-shadow: 0px 0px 1rem rgba(0, 0, 0, 0.2); */
        position: relative;
        z-index: 2;
        overflow: hidden;
        border-top: 0.0625rem solid #E5E5E5;
    }

        .dropdown-nav .items::before {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0.05;
            font-size: 18.75rem;
            z-index: -1;
            line-height: 1;
            color: #fff;
        }

        .dropdown-nav .items .item {
            display: none;
        }

            .dropdown-nav .items .item .nav-item {
                width: 25rem;
                padding-left: 10rem;
                padding-bottom: 5.375rem;
                position: relative;
            }

                .dropdown-nav .items .item .nav-item h1 {
                    color: #000;
                    font-size: 1.375rem;
                }

                .dropdown-nav .items .item .nav-item p {
                    color: #666;
                    font-size: 1rem;
                    margin-top: 0.375rem;
                }

                .dropdown-nav .items .item .nav-item a {
                    width: 7.75rem;
                    height: 2.625rem;
                    border-radius: 1.5625rem;
                    background-color: #F4F4F4;
                    border-radius: 1.5625rem;
                    left: 10rem;
                    bottom: 0;
                    transform: translateX(0);
                }

                .dropdown-nav .items .item .nav-item .learn-more {
                }

            .dropdown-nav .items .item.active {
                display: flex;
            }

            .dropdown-nav .items .item .img {
                width: 38%;
            }

                .dropdown-nav .items .item .img i {
                    padding-top: 50%;
                    display: block;
                    border-radius: 1.25rem;
                }

            .dropdown-nav .items .item .text {
                width: 62%;
                padding-left: 2.375rem;
            }

                .dropdown-nav .items .item .text .title {
                    color: #fff;
                    margin-bottom: 1.5rem;
                }

                    .dropdown-nav .items .item .text .title span {
                        font-size: 1.125rem;
                        text-transform: uppercase;
                        display: block;
                        margin-bottom: .3125rem;
                        letter-spacing: 1px;
                    }

                    .dropdown-nav .items .item .text .title strong {
                        font-size: 1.75rem;
                        line-height: 1;
                    }

                .dropdown-nav .items .item .text ul {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                }

                    .dropdown-nav .items .item .text ul li {
                        margin-bottom: 1.5rem;
                        width: calc((100% - 5rem)/3);
                    }

                        .dropdown-nav .items .item .text ul li:not(:nth-child(3n)) {
                            margin-right: 2.5rem;
                        }

                        .dropdown-nav .items .item .text ul li a {
                            position: relative;
                            z-index: 2;
                            display: flex;
                            align-items: center;
                            padding: .75rem 1.5rem;
                            color: #333;
                            border-radius: .5rem;
                            background: #e8f3f6;
                            transition: all 0.3s ease;
                            overflow: hidden;
                            font-size: 1.125rem;
                        }

                            .dropdown-nav .items .item .text ul li a:hover {
                                color: #fff;
                                background: #164a57;
                            }

                                .dropdown-nav .items .item .text ul li a:hover::after {
                                    opacity: 1;
                                }

                                .dropdown-nav .items .item .text ul li a:hover em::after {
                                    opacity: 0;
                                }

                                .dropdown-nav .items .item .text ul li a:hover em::before {
                                    opacity: 1;
                                }

                                .dropdown-nav .items .item .text ul li a:hover i {
                                    color: #fff;
                                }

                            .dropdown-nav .items .item .text ul li a em {
                                margin-right: .5rem;
                                width: 1.5rem;
                                height: 1.5rem;
                                position: relative;
                            }

                                .dropdown-nav .items .item .text ul li a em::after, .dropdown-nav .items .item .text ul li a em::before {
                                    content: '';
                                    width: 100%;
                                    height: 100%;
                                    background: url(../img/logo_icon2.png) center no-repeat;
                                    background-size: contain;
                                    position: absolute;
                                    left: 0;
                                    top: 0;
                                    transition: all 0.3s ease;
                                }

                                .dropdown-nav .items .item .text ul li a em::before {
                                    background: url(../img/nav_ico.png) center no-repeat;
                                    background-size: contain;
                                    opacity: 0;
                                }

                            .dropdown-nav .items .item .text ul li a strong {
                                font-weight: normal;
                            }

                            .dropdown-nav .items .item .text ul li a i {
                                margin-left: auto;
                                color: #164a57;
                                transition: all 0.3s ease;
                            }

.footer {
    height: 33rem;
    background: url(../img/footer/footer_bg.jpg) center no-repeat;
    background-size: 100% 100%;
    position: relative;
    z-index: 4;
}

    .footer .footer_top {
        width: 100%;
        height: 28.875rem;
        padding: 0 4.6875rem;
        border-bottom: 1px solid rgba(255, 255, 255, .5);
    }

        .footer .footer_top .footer_logo {
            text-align: center;
        }

            .footer .footer_top .footer_logo img {
                width: 6.5625rem;
                height: 6.5625rem;
                margin-top: 2.5rem;
            }

        .footer .footer_top p {
            color: #fff;
            font-size: 3rem;
            text-align: center;
        }

    .footer .footer_nav {
        padding: 0 19.375rem;
        margin-top: 3.125rem;
        margin-bottom: 2.5rem;
    }

        .footer .footer_nav li {
        }

            .footer .footer_nav li a {
                color: #fff;
                font-size: 1.375rem;
                transition: all .5s ease;
            }

                .footer .footer_nav li a:hover {
                    color: #4B702F;
                }

    .footer .footer_link ul {
        width: 20.5rem;
        height: 3.5rem;
        margin: 0 auto;
        border-radius: 1.875rem;
        background-color: rgba(75, 112, 47, .8);
    }

        .footer .footer_link ul li {
            position: relative;
        }

            .footer .footer_link ul li .tooltips {
                position: absolute;
                z-index: 2;
                bottom: calc(100% + 1.5rem);
                left: 50%;
                transform: translateX(-50%) translateY(-0.5rem);
                background: #fff;
                padding: 1rem;
                border-radius: .5rem;
                box-shadow: 0 2px 0.5rem rgba(0, 0, 0, 0.2);
                opacity: 0;
                pointer-events: none;
                transition: all 0.5s ease-out;
            }

                .footer .footer_link ul li .tooltips::after {
                    content: '';
                    width: 0;
                    height: 0;
                    border-top: .5rem solid #fff;
                    border-left: .5rem solid transparent;
                    border-right: .5rem solid transparent;
                    position: absolute;
                    left: 50%;
                    bottom: -.5rem;
                    transform: translateX(-50%);
                    z-index: 2;
                }

                .footer .footer_link ul li .tooltips .text {
                    line-height: 1.6;
                    color: #124350;
                    text-align: center;
                    white-space: nowrap;
                }

                .footer .footer_link ul li .tooltips .img {
                    width: 10rem;
                }

                    .footer .footer_link ul li .tooltips .img img {
                        width: 100%;
                    }

            .footer .footer_link ul li:hover .tooltips {
                transform: translateX(-50%);
                opacity: 1;
                pointer-events: auto;
            }

    .footer .footer_bottom {
        height: 4.125rem;
        color: #fff;
        font-size: 0.875rem;
        padding: 0 4.6875rem;
    }

        .footer .footer_bottom p {
            margin: 0 0.9375rem;
        }

@-webkit-keyframes banner_scroll {
    0% {
        transform: translateY(0);
    }

    20% {
        transform: translateY(-10%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes banner_scroll {
    0% {
        transform: translateY(0);
    }

    20% {
        transform: translateY(-10%);
    }

    100% {
        transform: translateY(0);
    }
}

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes aboutScroll {
    0% {
        -webkit-transform: translateY(-10px);
    }

    50% {
        -webkit-transform: translateY(10px);
    }

    100% {
        -webkit-transform: translateY(-10px);
    }
}

@keyframes aboutScroll {
    0% {
        transform: translateY(-10px);
    }

    50% {
        transform: translateY(10px);
    }

    100% {
        transform: translateY(-10px);
    }
}